<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>调查问卷</title>
		<link href="css/main.css" type="text/css" rel="stylesheet" />
		<script src="../jquery/jquery.min.js"></script>
	</head>
	<body>
		<div id="container">
			<div id='hearder'>
				<h2>《瞳孔中的暗杀者》动漫电影问卷调查</h2>
				<h4>此问卷是关于动漫电影，感谢参加本次答题</h4>
			</div>
			<div id="line"></div>
			<div id="content">
				<form>
					<ol>
						<li>您觉得此部电影的画质如何？
							<p>
								<ul class="cleanfloat">
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
								</ul>
							</p>
						</li>
						<li>您觉得此部电影的音质如何？
							<p>
								<ul class="cleanfloat">
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
								</ul>
							</p>
						</li>
						<li>您觉得此部电影的剧情如何？
							<p>
								<ul class="cleanfloat">
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
								</ul>
							</p>
						</li>
						<li>您觉得此部电影里的演员的表现如何？
							<p>
								<ul class="cleanfloat">
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
								</ul>
							</p>
						</li>
						<li>您二次观看此部动漫电影的可能性大不大？
							<p>
								<ul class="cleanfloat">
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
									<li>&#9733;</li>
								</ul>
							</p>
						</li>
					</ol>
					<button>提交</button>
				</form>
			</div>
		</div>
	</body>
</html>
<script>
	$(function() {
		$("ul li").hover(function() {
			$(this).addClass('hs');
			$(this).prevAll().addClass('hs');
		}, function() {
			$(this).removeClass('hs');
			$(this).prevAll().removeClass('hs');
		})

		$("ul li").click(function() {
			$(this).addClass('cs');
			$(this).prevAll().addClass('cs');
			$(this).nextAll().removeClass('cs');
		})
	})
</script>
